import { getToken, setToken, removeToken, setTimeStamp } from '@/utils/auth'
import { login, getUserProfile, getUserDetailById } from '@/api/user'
// 导入重置路由的方法
import { resetRouter } from '@/router'
const state = {
  // 共享token状态
  token: getToken(), // 初始化的时候,缓存没有就是没有
  // 共享用户的基本资料
  userInfo: {}
}

const mutations = {
  // 更新token
  updateToken(state, payload) {
    state.token = payload // 更新token数据
    // 同步更新到本地
    setToken(payload)
  },
  // 退出登录的时候 应该清除vuex中的token 同步清除本地缓存的token
  removeToken(state) {
    state.token = null
    removeToken() // 删除本地缓存token
  },
  setUserInfo(state, userInfo) {
  // 响应式更新一个对象
    // state.userInfo = userInfo // 更新state
    state.userInfo = { ...userInfo } // 用浅拷贝的方式去赋值对象,这样数据更新之后才会触发组件的更新
  },
  // 删除用户基本资料
  removeUserInfo(state) {
    state.userInfo = {}
  }
}

const actions = {
  // 封装一个登录action
  async login(context, data) {
    const result = await login(data)
    // 因为axios默认给返回体加了一层data

    // 如果为true表示登录成功 取返回的token
    context.commit('updateToken', result)
    // promise的then catch
    // async await
    // 写入时间戳
    setTimeStamp()// 将当前的最新时间写入缓存
  },
  // 获取用户的信息
  async getUserInfo({ commit }) {
    const result = await getUserProfile() // 这里的result返回的就是数据data

    const detailResult = await getUserDetailById(result.userId) // 获取用户信息中的头像
    // console.log(detailResult)
    // commit('setUserInfo', { ...result }) // 提交mutations

    commit('setUserInfo', { ...result, ...detailResult }) // 提交mutations

    return result // 这里的return 是为了八天后
  },
  // 登出action  删除token  删除用户资料
  logout({ commit }) {
    // 调用删除token的方法
    commit('removeToken')
    // 调用删除用户资料的方法
    commit('removeUserInfo')
    // 重置路由
    resetRouter()
    // 重置vuex的路由数据
    // vuex中加了命名空间的子模块,怎么调用另一个模块
    commit('permission/setRoutes', [], { root: true })
    // 第三个参数 root:true表示  commit实际是用顶级调用方式
  }
}

export default {
  namespaced: true,
  state,
  mutations,
  actions
}
